define(["jquery", "jquery-cookie"], function ($) {
    // header
    // 渲染头部二级菜单内容
    function navDownload() {
        // 手机
        navP();
        function navP() {
            $.ajax({
                type: 'get',
                // 这里的路径是相对于首页index.html的路径
                url: '../data/subNavP.json',
                success: function (arr) {
                    // console.log(arr);
                    var html = ``;
                    for (var i = 0; i < arr.length; i++) {
                        html += `
                                <li>
                                    <a href="javascript:;">
                                        <em style='background-image: ${arr[i].imgUrl};'></em>
                                        <p>${arr[i].title}</p>
                                        <span>${arr[i].price}</span>
                                    </a>
                                </li>
                            `;
                    }
                    // 将拼接成功的商品, 渲染到页面上
                    $('#subNavP').html(html);
                },
                error: function (err) {
                    console.log(err);
                }
            })
        }

        // 声学
        navM();
        function navM() {
            $.ajax({
                type: 'get',
                // 这里的路径是相对于首页index.html的路径
                url: '../data/subNavM.json',
                success: function (arr) {
                    // console.log(arr);
                    var html = ``;
                    for (var i = 0; i < arr.length; i++) {
                        html += `
                                <li>
                                    <a href="javascript:;">
                                        <em style='background-image: ${arr[i].imgUrl};'></em>
                                        <p>${arr[i].title}</p>
                                        <span>${arr[i].price}</span>
                                    </a>
                                </li>
                            `;
                    }
                    // 将拼接成功的商品, 渲染到页面上
                    $('#subNavM').html(html);
                },
                error: function (err) {
                    console.log(err);
                }
            })
        }

        // 配件
        navO();
        function navO() {
            $.ajax({
                type: 'get',
                // 这里的路径是相对于首页index.html的路径
                url: '../data/subNavO.json',
                success: function (arr) {
                    // console.log(arr);
                    var html = ``;
                    for (var i = 0; i < arr.length; i++) {
                        html += `
                                <li>
                                    <a href="javascript:;">
                                        <em style='background-image: ${arr[i].imgUrl};'></em>
                                        <p>${arr[i].title}</p>
                                        <span>${arr[i].price}</span>
                                    </a>
                                </li>
                            `;
                    }
                    // 将拼接成功的商品, 渲染到页面上
                    $('#subNavO').html(html);
                },
                error: function (err) {
                    console.log(err);
                }
            })
        }

        // 生活
        navL();
        function navL() {
            $.ajax({
                type: 'get',
                // 这里的路径是相对于首页index.html的路径
                url: '../data/subNavL.json',
                success: function (arr) {
                    // console.log(arr);
                    var html = ``;
                    for (var i = 0; i < arr.length; i++) {
                        html += `
                                <li>
                                    <a href="javascript:;">
                                        <em style='background-image: ${arr[i].imgUrl};'></em>
                                        <p>${arr[i].title}</p>
                                        <span>${arr[i].price}</span>
                                    </a>
                                </li>
                            `;
                    }
                    // 将拼接成功的商品, 渲染到页面上
                    $('#subNavL').html(html);
                },
                error: function (err) {
                    console.log(err);
                }
            })
        }
    }


    // banner
    // 轮播图
    function carousel() {
        var index = 0;
        var lastIndex = 0;
        var timer = null;

        // 点击导航按钮时, 切换成对应的图片
        $('#bannerNav li').click(function () {
            clearInterval(timer);
            lastIndex = index;
            index = $(this).index();
            change();
        });

        // 自动轮播
        timer = setInterval(() => {
            lastIndex = index;
            index++;
            change();
        }, 3000);

        // 鼠标移入移出
        $('#bannerList').mouseenter(function () {
            clearInterval(timer);
        }).mouseleave(function () {
            timer = setInterval(function () {
                lastIndex = index;
                index++;
                change();
            }, 3000);
        });

        // 切换图片
        function change() {
            // 修改导航按钮的样式
            $('#bannerNav li').eq(lastIndex).removeClass('banner-nav-on');
            $('#bannerNav li').eq(index).addClass('banner-nav-on');

            // 回到第一张时按钮的样式
            if (index === $('#bannerNav li').size()) {
                $('#bannerNav li').eq(0).addClass('banner-nav-on');
            }

            // 改变ul的left
            $('#bannerList').stop(true).animate({
                left: - 655 - 2560 * index
            }, 500, function () {
                // 到了第三张, 瞬间回到初始位置
                if (index === $('#bannerNav li').size()) {
                    index = 0;
                    $('#bannerList').css({
                        left: - 655
                    });
                }
            });
        }
    }


    // container
    // 渲染商品列表
    function contentDownload() {
        // 商品
        $.ajax({
            type: 'get',
            url: '../data/goodsList.json',
            success: function (arr) {
                // console.log(arr);
                var html = '';
                arr.forEach(item => {
                    html += `
                    <li>
                        <a href="javascript:;">
                            <img src="${item.imgUrl}" alt="">
                            <ul class="item-color"></ul>
                            <h3 class="item-title">${item.title}</h3>
                            <p class="item-desc">
                                ${item.desc}
                            </p>
                            <p class="item-price">
                                <em>￥</em>
                                <span>${item.price}</span>
                            </p>
                            <button id="${item.id}" class="add-cart">加入购物车</button>
                        </a>
                    </li>
                    `;
                });
                $('#goodsList').html(html);
            },
            error: function (err) {
                console.log(err);
            }
        });

        // 为您推荐
        $.ajax({
            type: 'get',
            url: '../data/goodsList-recommend.json',
            success: function (arr) {
                // console.log(arr);
                var html = '';
                arr.forEach(item => {
                    html += `
                    <li>
                        <a href="javascript:;">
                            <img src="${item.imgUrl}" alt="">
                            <h3 class="rec-title">${item.title}</h3>
                            <p class="rec-price">
                                <span>￥</span>
                                <span class="rec-price-txt">${item.price}</span>
                            </p>
                        </a>
                    </li>
                    `;
                });
                $('#recGoodsList').html(html);
            },
            error: function (err) {
                console.log(err);
            }
        });
    }

    // 为您推荐切换
    function recGoods() {
        var index = 0;
        var lastIndex = 0;
        // 点击导航按钮时切换
        $('#recNavList li').click(function () {
            lastIndex = index;
            index = $(this).index();
            $('#recNavList li').eq(lastIndex).removeClass('rev-nav-on');
            $('#recNavList li').eq(index).addClass('rev-nav-on');

            if (index == 0) {
                $('#recGoodsList').attr('class', 'recommend-goods-list').addClass('rec-fir');
            }else if(index == 1){
                $('#recGoodsList').attr('class', 'recommend-goods-list').addClass('rec-sec');
            }else if(index == 2){
                $('#recGoodsList').attr('class', 'recommend-goods-list').addClass('rec-thi');
            }
        });
    }


    return {
        navDownload: navDownload,
        carousel: carousel,
        contentDownload: contentDownload,
        recGoods: recGoods
    }
})